<template>
	<!-- 营业时间选择picker -->
	<cdsPicker v-model="BusinessTimePopupShow" @confirm="BusinessTimePopupConfirm" :title="props.title" :showClose="props.showClose" :showFooter="props.showFooter">
		<template v-slot:body>
			<timeRange v-model="timeRangeValue" />
		</template>
	</cdsPicker>
</template>

<script setup>
import { ref } from 'vue';
import cdsPicker from '@/subPages/components/cds-picker/index.vue';
import timeRange from '@/subPages/components/cds-timeRange-picker/timeRange.vue';

const emit = defineEmits(['confirm', 'close']);

const props = defineProps({
	mode: {
		type: String,
		default: 'bottom'
	},
	title: {
		type: String,
		default: ''
	},
	showClose: {
		type: Boolean,
		default: true
	},
	showFooter: {
		type: Boolean,
		default: true
	}
});

// 时间范围选择绑定的值
const timeRangeValue = ref([['00', '00'], ['23', '59']]);

// 控制弹窗的显示
const BusinessTimePopupShow = defineModel(false);

// 营业时间弹窗确认
const BusinessTimePopupConfirm = () => {
	emit('confirm', timeRangeValue.value)
};

// 弹窗关闭
const close = () => {
	show.value = false;
	emit('close');
};
</script>

<style lang="scss" scoped>
</style>
